<meta charset="utf-8"/>
<button >1</button>
<button onclick="s2()">2</button>
<button onclick="s3()">3</button>
<button onclick="s4()">4</button>
<button onclick="s5()">5</button>
<button onclick="fd()">放大</button>
<button onclick="sx()">缩小</button>
<button onclick="xz()">旋转</button>
<hr>
<img id="pic" width="400" src="11.jpg"/>
<script>
function s2(){
 pic.src="22.jpg";}
function s3(){
               pic.src="33.jpg";}
function s4(){
               pic.src="44.jpg";}

function s5(){
               pic.src="55.jpg";}

function fd(){
          pic.width=pic.width*1.2;}
function sx(){
          pic.width=pic.width*0.8;}
var deg = 0;

    function xz(){
        deg += 90;
        pic.style.transform = "rotate("+deg+"deg)";
    }
</script>